// 1. v-for更新监测
// 能改变 原数组 的数组方法
// push() / pop() / shift() / unshift() / splice() / sort() / reverse() / ...
// 不能改变 原数组的 数组方法
// map() / forEach() / filter() / concat() / slice() / ...
// 想要影响v-for更新，解决方案：
// 方案1：覆盖原数组
// 方案2：this.$set() - 只改变某一个值

// 2. 虚拟DOM
// 什么：js对象 - 保存DOM关键信息
// 为什么：提供性能，真实的DOM属性太多，没办法快速的找到谁变化了
// 过程：
// template => 虚拟DOM => 真实DOM

// 3. 具体如何把虚拟DOM替换到真实DOM上的？
// diff算法：(比较新旧DOM的差异)
// (1)：新旧DOM - 同级互比
// 根标签改变 -> (决定)删除整个DOM重新创建 -> 更新真实DOM
// 根标签未变，属性变了 -> 复用标签，只更新属性 -> 更新真实DOM
// 根标签未变，属性未变，子/内容改变
//      无key -> (比较新旧DOM差异) -> 尽可能复用标签(就地更新)
//      有key -> (以key来比较新旧DOM的差异) -> 创建新的标签到真实DOM

// 4. 动态class
// 语法  :class-"{类名: bool}"

// 5. 动态style
// 语法  :style="{css属性名: 值}"